<template>
  <div class="v-container g-white-space">
    <v-header title="选择城市">
      <span class="back" @click="goBack()">
        <i class="el-icon-arrow-left"></i>返回
      </span>
    </v-header>
    <div class="v-main">
      <div class="dingwei" @click="goPoint('gps')">
        <span id="gps">{{gpsText}}</span>&nbsp;&nbsp;
        <span style="color:#B2B2B2;">GPS定位</span>
      </div>
      <div v-if="cityList" v-for="(value,key,index) in cityList" :key="index">
        <div class="city-title">{{value.name}}</div>
        <ul class="citylist">
          <li v-for="(item, index2) in value.list" :key="index2" @click="goPoint(item.name)">{{item.name}}</li>
        </ul>
      </div>
    </div>
  </div>
</template>

<script>
const proxy = require('@/env/proxy');
const getAreaList_jk = proxy.getAreaList;
import vHeader from '@/components/Header.vue';
import { MessageBox } from 'mint-ui';
import { Resource } from "@/services/resource";
import { sourceCode } from '@/env';
import axios from 'axios';
import qs from 'qs';

const BMap = window.BMap;

export default {
  name: 'city',
  components: {
    vHeader
  },
  props: {
    title: {
      type: String,
      default: '标题'
    }
  },
  data() {
    return {
      msg: 'Footera',
      gpsText: '定位中...',
      cityList: '', //列表数据
      isCloseNum: 0
    };
  },
  mounted() {
    this.$store.dispatch('openLoading');
    this.gps();
    this.getAreaList();
  },
  methods: {
    // 返回上一页
    goBack() {
      this.$router.go(-1);
    },
    getAreaList() {
      let that = this;
      var _obj = {
        sourceCode: sourceCode
      };
      return Resource.relayPost
            .post({}, {"url":getAreaList_jk,
              "params":_obj})
            .then(res => {
              if (res.head.resultCode == "000000") {
                let res2 = res.body.result;
                var _res2Obj=JSON.parse(res2);
                let data = _res2Obj.shopSiteAreaTreeVO;

                let _proObj = new Object();
                let _allCityDate = new Object();
                for (var j = 0, len = data.length; j < len; j++) {
                  if (data[j]['type'] == '0') {
                    var _id = data[j]['id'];
                    _proObj[_id] = new Object();
                    _proObj[_id].name = data[j]['name'];
                    _proObj[_id].list = new Array();
                  }
                }
                for (var j = 0, len = data.length; j < len; j++) {
                  if (data[j]['type'] == '1') {
                    var _pid = data[j]['pId'];
                    if (_proObj.hasOwnProperty(_pid)) {
                      var _list = _proObj[_pid].list;
                      _list.push(data[j]);
                    }
                  }
                }

                that.cityList = _proObj;
                that.isCloseNum++;
                if (that.isCloseNum >= 2) {
                  that.$nextTick(() => {
                    that.$store.dispatch('closeLoading');
                  });
                }
              }
            })
      
    },
    // 地理定位
    gps() {
      const that = this;
      if (sessionStorage.gps) {
        that.gpsText = sessionStorage.gps;
        console.log('11111');
        console.log(that.gpsText);
      }
      if (sessionStorage.longitude == undefined) {
        var _timeOut;
        _timeOut = setTimeout(function() {
          that.$store.dispatch('closeLoading');
          sessionStorage.longitude = '121.622248'; //经度
          sessionStorage.latitude = '29.865032'; //纬度
          sessionStorage.invented = 'true'; //虚拟坐标
          that.isCloseNum++;
          if (that.isCloseNum >= 2) {
            that.$nextTick(() => {
              that.$store.dispatch('closeLoading');
            });
          }
        }, 5000);
        if (navigator.geolocation) {
          var geolocation = new BMap.Geolocation();
          var geoc = new BMap.Geocoder();
          geolocation.getCurrentPosition(
            function(r) {
              that.isCloseNum++;
              if (that.isCloseNum >= 2) {
                that.$nextTick(() => {
                  that.$store.dispatch('closeLoading');
                });
              }

              clearTimeout(_timeOut);
              // eslint-disable-next-line
              if (this.getStatus() == BMAP_STATUS_SUCCESS) {
                geoc.getLocation(r.point, function(rs) {
                  var addComp = rs.addressComponents;
                  console.info(rs);
                  sessionStorage.longitude = rs.point.lng; // 经度
                  sessionStorage.latitude = rs.point.lat; // 纬度
                  sessionStorage.gps = addComp.city; // 城市
                  sessionStorage.myAddress = addComp.province + addComp.city + addComp.district + addComp.street + addComp.streetNumber;
                  that.gpsText = sessionStorage.gps;
                  console.log(sessionStorage.gps);
                  console.log(that.gpsText);
                });
              } else {
                this.$message.error('failed' + this.getStatus());
              }
            },
            {
              enableHighAccuracy: true
            }
          );
        } else {
          that.isCloseNum++;
          if (that.isCloseNum >= 2) {
            that.$nextTick(() => {
              that.$store.dispatch('closeLoading');
            });
          }
          this.$message.error('该浏览器不支持地理定位。');
        }
      } else {
        that.isCloseNum++;
        if (that.isCloseNum >= 2) {
          that.$nextTick(() => {
            that.$store.dispatch('closeLoading');
          });
        }
      }
    },
    goPoint(name) {
      console.log(name);
      if (name == 'gps') {
        if (sessionStorage.gps) {
          sessionStorage.cityName = sessionStorage.gps;
          this.$router.push('point');
        }
      } else {
        sessionStorage.cityName = name;
        this.$router.push('point');
      }
    },
    // 跳转页面
    pageTo(name) {
      console.log(name);
      this.$router.push(name);
    }
  }
};
</script>

<style lang="less" scoped>
@import url('./city.less');
</style>


